<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <input type="button" value="Click" onclick="console.log(this)">
    <input type="button" value="Click Me" onclick="showMessage(value)">

    <!-- 获取表单其他元素的值 -->
    <form action="">
        <input type="text" name="username" value="username">
        <input type="button" value="input username" onclick="inputUserName(username.value)">
    </form>
    
    <script>
        /**
         * 事件: 用户或浏览器执行的动作
         *       比如单击(click)、加载(load)、鼠标悬停等
         * 
         * 事件处理程序: 为响应事件而调用的函数, 函数名是on+事件名
        */

        const showMessage = (value) => {  // 默认有一个局部变量event对象
            console.log('showMessage')
            console.log(event.type)
            console.log(this) // Windows对象
            console.log(value)  // 可以直接获取按钮的value值
        }

        // 直接获取元素节点
        const inputUserName = (value) => {
            console.log(value)
        }
    </script>
</body>
</html>